@extends('layouts/main')
@section('content')
    <style>
        .layui-body{overflow-x: scroll;}
        .error-tip{font-size: 16px;margin-top: 10px;margin-bottom: 10px;}
    </style>
    <div style="padding: 15px;">
        @if($db_name)
            <input type="hidden" id="db_name_input" value="{{$db_name}}">
            <input type="hidden" id="table_name_input" value="{{$table_name}}">
            <button class="layui-btn layui-btn-danger" type="button"  onclick="dropTable('{{$table_name}}', '{{$db_name}}')">删除表</button><br>
            <div class="layui-tab layui-tab-brief" lay-filter="docDemoTabBrief">
                <ul class="layui-tab-title">
                    @if($tab=='record')
                        <li class="layui-this">浏览</li>
                    @else
                        <li><a href="/index/record?db_name={{$db_name}}&table_name={{$table_name}}">浏览</a></li>
                    @endif
                    @if($tab=='structure')
                        <li class="layui-this">结构</li>
                    @else
                        <li><a href="/index/structure?db_name={{$db_name}}&table_name={{$table_name}}">结构</a></li>
                    @endif
                    @if($tab=='operation')
                        <li>操作</li>
                    @else
                        <li><a href="/index/operation?db_name={{$db_name}}&table_name={{$table_name}}">操作</a></li>
                    @endif
                </ul>
                <div class="layui-tab-content">
                </div>
            </div>
            <div class="error-tip"></div>
            <table class="layui-table">
                <colgroup>
                    <col width="150">
                    <col width="200">
                    <col>
                </colgroup>
                <thead>
                <tr>
                    <td>序号</td>
                    <td>字段名</td>
                    <td>类型</td>
                    <td>排序规则</td>
                    <td>空</td>
                    <td>默认</td>
                    <td>注释</td>
                    <td>额外</td>
                    <td>操作</td>
                </tr>
                </thead>
                <tbody id="field-list">
                @foreach($table_structure as $k => $v)
                    <tr>
                        <td>{{$k+1}}</td>
                        <td class="column_name">{{$v['COLUMN_NAME']}}</td>
                        <td class="column_type">{{$v['COLUMN_TYPE']}}</td>
                        <td class="collation_name">{{$v['COLLATION_NAME']}}</td>
                        <td class="is_nullable">{{$v['IS_NULLABLE']}}</td>
                        <td class="column_default">{{$v['COLUMN_DEFAULT']}}</td>
                        <td class="column_comment">{{$v['COLUMN_COMMENT']}}</td>
                        <td class="column_extra">@if($v['COLUMN_KEY'] == 'PRI') primary key<br> @endif{{$v['EXTRA']}}</td>
                        <td>
                            <button type="button" class="layui-btn column_edit" onclick="gotoEditPage('{{$v['COLUMN_NAME']}}')"><i class="layui-icon">&#xe642;</i>修改</button>
                            <button type="button" class="layui-btn layui-btn-danger column_delete" data-id="{{$v['COLUMN_NAME']}}"><i class="layui-icon">&#xe640;</i>删除</button>
                        </td>
                    </tr>
                @endforeach
                </tbody>
            </table>
            <div>
                <form class="layui-form">
                    <div class="layui-form-item" style="float: left;">
                        <label class="layui-form-label" style="width: 100px;">增加一个字段</label>
                        <div class="layui-input-inline">
                            <select name="field_position" lay-verify="" lay-search class="field_position">
                                <option value="0">at beginning of table</option>
                                @foreach($table_structure as $k => $v)
                                    <option value="{{$v['COLUMN_NAME']}}" @if($k==count($table_structure)-1) selected @endif>于{{$v['COLUMN_NAME']}}之后</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                    <button type="button" class="layui-btn layui-btn-radius" onclick="createField()">执行</button>
                </form>
            </div>

        @else
            请在左侧选择一个数据库以查看该数据库下的表
        @endif
    </div>
    <script type="text/javascript" src="/js/index/structure.js"></script>
    <script>
        layui.use('element', function(){
            var element = layui.element;
        });
        layui.use('form', function() {
            var form = layui.form;
            form.render();
        });

        function gotoEditPage(field_name) {
            location.href = '/index/editField?db_name={{$db_name}}&table_name={{$table_name}}&field_name='+field_name;
        }
        function createField() {
            location.href = '/index/createField?db_name={{$db_name}}&table_name={{$table_name}}&after='+$('.field_position').val();
        }

    </script>
@endsection